// 获取URL中的任务ID
const taskId = new URLSearchParams(window.location.search).get('id');

// 初始化图表
function initCharts() {
  // 进度趋势图
  const progressCtx = document.getElementById('progressChart').getContext('2d');
  new Chart(progressCtx, {
    type: 'line',
    data: {
      labels: ['1月', '2月', '3月', '4月', '5月', '6月'],
      datasets: [{
        label: '任务完成进度',
        data: [10, 30, 45, 60, 75, 90],
        borderColor: '#165DFF',
        backgroundColor: 'rgba(22, 93, 255, 0.1)',
        tension: 0.3,
        fill: true
      }]
    },
    options: {
      responsive: true,
      maintainAspectRatio: false,
      scales: {
        y: {
          beginAtZero: true,
          max: 100,
          title: {
            display: true,
            text: '完成百分比 (%)'
          }
        }
      }
    }
  });

  // 任务类型分布图
  const typeCtx = document.getElementById('taskTypeChart').getContext('2d');
  new Chart(typeCtx, {
    type: 'doughnut',
    data: {
      labels: ['开发', '文档', '测试', '会议'],
      datasets: [{
        data: [40, 25, 20, 15],
        backgroundColor: [
          '#165DFF',
          '#52C41A',
          '#FAAD14',
          '#F5222D'
        ]
      }]
    },
    options: {
      responsive: true,
      maintainAspectRatio: false,
      plugins: {
        legend: {
          position: 'right'
        }
      }
    }
  });
}

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', () => {
  // 加载任务详情数据（实际项目中从API获取）
  loadTaskDetails(taskId);

  // 初始化图表
  initCharts();
});

// 加载任务详情
function loadTaskDetails(id) {
  // 这里应该是从API或localStorage获取数据的逻辑
  // 示例：
  const task = {
    title: '用户管理系统开发',
    status: 'in-progress',
    priority: 'high',
    deadline: '2025-9-11',
    assignee: '张三'
  };

  // 更新页面内容
  document.getElementById('task-title').textContent = task.title;
  document.getElementById('task-deadline').innerHTML = `<i class="fa fa-calendar mr-1"></i> 截止日期: ${task.deadline}`;
  document.getElementById('task-assignee').innerHTML = `<i class="fa fa-user mr-1"></i> 负责人: ${task.assignee}`;

  // 根据优先级更新显示
  if (task.priority === 'high') {
    document.getElementById('task-priority').innerHTML = '<i class="fa fa-flag mr-1"></i> 高优先级';
    document.getElementById('task-priority').className = 'inline-flex items-center px-3 py-1 rounded-full text-sm bg-danger/10 text-danger';
  }
}
